home *** CD-ROM | disk | FTP | other *** search
/ MacAddict 123 / MacAddict_123_2006_11.iso / Software / Productivity / iClip lite 2.wdgt / js / scrollbar.js < prev   
Text File  |  2006-08-05  |  8KB  |  188 lines
  1. /* Copyright ¬© 2006, Inventive. */
  2.  
  3. /* classes */
  4.     function Scrollbar(bar, area, horizontal, margin, padding) {
  5.         /* events */
  6.             var self = this;
  7.             addEvent(window, "mousemove", false, function(event) {
  8.                 if (self.dragging) self.scrollBar((self.horizontal ? event.clientX : event.clientY) - self.offset - self.click);
  9.             });
  10.             addEvent(window, "mouseup", false, function(event) {
  11.                 if (self.dragging) {
  12.                     self.scrollArea(Math.round((self.horizontal ? self.area.scrollLeft : self.area.scrollTop) / 102) * 102);
  13.                     self.dragging = false;
  14.                 }
  15.                 self.tracking.on = false;
  16.                 if (self.tracking.timer != null) {
  17.                     clearInterval(self.tracking.timer);
  18.                     self.tracking.timer = null;
  19.                 }
  20.             });
  21.             addEvent(window, "keypress", false, function(event) {
  22.                 if (self.focused && !(event.shiftKey || event.metaKey || event.altKey || event.ctrlKey)) {
  23.                     var handled = true;
  24.                     switch (event.keyIdentifier) {
  25.                         case "Up":
  26.                             if (!horizontal) self.scrollArea(self.area.scrollTop - 10);
  27.                             break;
  28.                         case "Down":
  29.                             if (!horizontal) self.scrollArea(self.area.scrollTop + 10);
  30.                             break;
  31.                         case "Left":
  32.                             if (horizontal) self.scrollArea(self.area.scrollLeft - 102);
  33.                             break;
  34.                         case "Right":
  35.                             if (horizontal) self.scrollArea(self.area.scrollLeft + 102);
  36.                             break;
  37.                         case "PageUp":
  38.                             self.scrollArea(self.horizontal ? self.area.scrollLeft - self.area.clientWidth : self.area.scrollTop - self.area.clientHeight);
  39.                             break;
  40.                         case "PageDown":
  41.                             self.scrollArea(self.horizontal ? self.area.scrollLeft + self.area.clientWidth : self.area.scrollTop + self.area.clientHeight);
  42.                             break;
  43.                         case "Home":
  44.                             self.scrollBar(0);
  45.                             break;
  46.                         case "End":
  47.                             self.scrollBar(self.max);
  48.                             break;
  49.                         default:
  50.                             handled = false;
  51.                     }
  52.                     if (handled) event.stopPropagation();
  53.                 }
  54.             });
  55.             addEvent(area, "mouseover", false, function(event) { self.focused = true; });
  56.             addEvent(area, "mouseout", false, function(event) { self.focused = false; });
  57.             addEvent(area, "mousewheel", false, function(event) {
  58.                 var delta = self.horizontal ? event.wheelDelta : 0 - event.wheelDelta;
  59.                 var deltaScroll = delta / 120 * 50;
  60.                 var binsToScroll = Math.round(deltaScroll / 102);
  61.                 self.scrollArea((self.horizontal ? self.area.scrollLeft : self.area.scrollTop) - (binsToScroll * 102));
  62.             });
  63.             addEvent(bar, "mouseover", false, function(event) { self.focused = true; });
  64.             addEvent(bar, "mouseout", false, function(event) { self.focused = false; });
  65.             addEvent(bar, "mousedown", false, function(event) {
  66.                 self.tracking.on = true;
  67.                 if (scrollTracking(event)) {
  68.                     self.tracking.timer = setInterval(function() {
  69.                         if (scrollTracking(event)) {
  70.                             clearInterval(self.tracking.timer);
  71.                             startTracking(event);
  72.                         }
  73.                     }, 500);
  74.                 }
  75.             });
  76.             addEvent(bar, "mousemove", false, function(event) {
  77.                 if (self.tracking.on && self.tracking.timer == null)
  78.                     startTracking(event);
  79.             });
  80.             addEvent(bar, "mousewheel", false, function(event) {
  81.                 var delta = self.horizontal ? event.wheelDelta : 0 - event.wheelDelta;
  82.                 var deltaScroll = delta / 120 * 50;
  83.                 var binsToScroll = Math.round(deltaScroll / 102);
  84.                 self.scrollArea((self.horizontal ? self.area.scrollLeft : self.area.scrollTop) - (binsToScroll * 102));
  85.             });
  86.             addEvent(bar.childNodes[0], "mousedown", false, function(event) { event.preventDefault(); });
  87.             addEvent(bar.childNodes[1], "mousedown", false, function(event) { event.preventDefault(); });
  88.             addEvent(bar.childNodes[2], "mousedown", false, function(event) { event.preventDefault(); });
  89.             addEvent(bar.childNodes[3], "mousedown", false, function(event) {
  90.                 self.click = (self.horizontal ? event.clientX : event.clientY) - self.offset - self.position;
  91.                 self.dragging = true;
  92.                 event.stopPropagation();
  93.             });
  94.             addEvent(bar.childNodes[3].childNodes[0], "mousedown", false, function(event) { event.preventDefault(); });
  95.             addEvent(bar.childNodes[3].childNodes[1], "mousedown", false, function(event) { event.preventDefault(); });
  96.             addEvent(bar.childNodes[3].childNodes[2], "mousedown", false, function(event) { event.preventDefault(); });
  97.         
  98.         /* functions */
  99.             function startTracking(event) {
  100.                 self.tracking.timer = setInterval(function() {
  101.                     if (!scrollTracking(event)) {
  102.                         clearInterval(self.tracking.timer);
  103.                         self.tracking.timer = null;
  104.                     }
  105.                 }, 125);
  106.             }
  107.             
  108.             function scrollTracking(event) {
  109.                 self.click = (self.horizontal ? event.clientX : event.clientY) - self.offset;
  110.                 if (self.click >= self.position && self.click <= self.position + self.widgetSize)
  111.                     return false;
  112.                 if (self.click < self.position)
  113.                     self.scrollArea(self.horizontal ? self.area.scrollLeft - self.area.clientWidth : self.area.scrollTop - self.area.clientHeight);
  114.                 else
  115.                     self.scrollArea(self.horizontal ? self.area.scrollLeft + self.area.clientWidth : self.area.scrollTop + self.area.clientHeight);
  116.                 return true;
  117.             }
  118.         
  119.         /* variables */
  120.             this.bar = bar;
  121.             this.area = area;
  122.             this.horizontal = horizontal;
  123.             this.margin = margin * 2;
  124.             this.padding = padding;
  125.             
  126.             this.offset = margin + 83;
  127.             this.scrollRatio = 0;
  128.             this.trackSize = 0;
  129.             this.trackRatio = 0;
  130.             this.widgetSize = 0;
  131.             this.max = 0;
  132.             this.click = 0;
  133.             this.position = 0;
  134.             this.tracking = {on: false, timer: null};
  135.             this.focused = false;
  136.         
  137.         /* code */
  138.             //var node = bar;
  139.             //do {
  140.             //    if (this.horizontal)
  141.             //        if (node.offsetLeft != null) this.offset += node.offsetLeft;
  142.             //    else
  143.             //        if (node.offsetTop != null) this.offset += node.offsetTop;
  144.             //    node = node.parentNode;
  145.             //}
  146.             //while (node != null);
  147.             this.refresh();
  148.     }
  149.     
  150.     Scrollbar.prototype.refresh = function() {
  151.         this.scrollRatio = this.horizontal ? this.area.scrollWidth / this.area.clientWidth : this.area.scrollHeight / this.area.clientHeight;
  152.         this.trackSize = (this.horizontal ? this.area.clientWidth : this.area.clientHeight) - this.margin;
  153.         this.widgetSize = this.trackSize / this.scrollRatio;
  154.         this.trackRatio = ((this.horizontal ? this.area.clientWidth : this.area.clientHeight) - this.widgetSize) / (this.trackSize - Math.max(this.widgetSize, 24));
  155.         if (this.widgetSize < 24) this.widgetSize = 24;
  156.         this.max = this.trackSize - this.widgetSize;
  157.         this.bar.style.display = this.widgetSize < this.trackSize ? "block" : "none";
  158.         if (this.horizontal) {
  159.             this.area.style.paddingBottom = this.widgetSize < this.trackSize ? ((this.padding + 17) / 10) + "em" : (this.padding / 10) + "em";
  160.             this.bar.childNodes[1].style.width = ((this.trackSize - 28) / 10) + "em";
  161.             this.bar.childNodes[3].childNodes[1].style.width = ((this.widgetSize - 24) / 10) + "em";
  162.         }
  163.         else {
  164.             this.area.style.paddingRight = this.widgetSize < this.trackSize ? ((this.padding + 17) / 10) + "em" : (this.padding / 10) + "em";
  165.             this.bar.childNodes[1].style.height = ((this.trackSize - 28) / 10) + "em";
  166.             this.bar.childNodes[3].childNodes[1].style.height = ((this.widgetSize - 24) / 10) + "em";
  167.         }
  168.         this.scrollArea(this.horizontal ? this.area.scrollLeft : this.area.scrollTop);
  169.         //this.area.innerHTML = this.area.innerHTML;
  170.     }
  171.     
  172.     Scrollbar.prototype.scrollBar = function(to) {
  173.         if (to < 0) this.position = 0;
  174.         else if (to > this.max) this.position = this.max;
  175.         else this.position = to;
  176.         if (this.horizontal) {
  177.             this.area.scrollLeft = (this.position * this.trackRatio) * this.scrollRatio;
  178.             this.bar.childNodes[3].style.left = (this.position / 10) + "em";
  179.         }
  180.         else {
  181.             this.area.scrollTop = (this.position * this.trackRatio) * this.scrollRatio;
  182.             this.bar.childNodes[3].style.top = (this.position / 10) + "em";
  183.         }
  184.     }
  185.     
  186.     Scrollbar.prototype.scrollArea = function(to) {
  187.         this.scrollBar((to / this.scrollRatio) / this.trackRatio);
  188.     }